<template>
	<div class="pageBg" style="min-height: 100%;">
		<Skeleton v-if="skeletonLoading" type="list"></Skeleton>
		<Head type="list" title="急聘专区" :isBack="false">
			<ListFilters ref="refListFilters" :params="params" otherFilterType="jobListType"
				@doSearchByDistrict="doSearchByDistrict" @doSearchByCategory="doSearchByCategory"
				@doSearchByOther="doSearchByOther">
				<view class="tabBtns">
					<view class="btn ac">综合</view>
				</view>
			</ListFilters>
		</Head>
		<view class="jobList">
			<jobItem v-for="(item,index) in dataset" :key="item.id" :item="item" @toDetail="toDetail"></jobItem>
			<u-loadmore v-if="dataset.length >= pagesize" class="u-loadmore" :status="finished_status"></u-loadmore>
			<Empty v-if="show_empty"></Empty>
		</view>
	</div>
</template>

<script>
	import http from '@/utils/http'
	import api from '@/api'
	import jobItem from '@/components/listItem/jobItem.vue'
	import ListFilters from '@/components/ListFilters.vue'
	import Skeleton from '@/components/Skeleton.vue'
	import {
		onShareAppMessage,
		onShareTimeline
	} from '@/utils/share.js'
	export default {
		components: {
			jobItem,
			ListFilters,
			Skeleton
		},
		onPageScroll(res) {
			uni.$emit('onPageScroll', res.scrollTop)
		},
		onReachBottom() {
			this.finished_status = 'loading';
			this.page++
			this.fetchData(false)
		},
		mounted() {
			this.fetchData(true)
		},
		data() {
			return {
				skeletonLoading: true,
				dataset: [],
				finished_status: 'loadmore',
				page: 1,
				pagesize: 15,
				show_empty: false,
				params: {
					emergency: 1,
					search_type: 'list',
					keyword: '',
					district1: '',
					district2: '',
					district3: '',
					districtName: '地区',
					category1: '',
					category2: '',
					category3: '',
					categoryName: '职位',
					experience: '',
					minwage: '',
					maxwage: '',
					filter_apply: '',
					nature: '',
					education: '',
					tag: '',
					settr: '',
					otherNum: 0,
					wage: ''
				},
				districtTitle: '地区',
				categoryTitle: '职位',
				selectArrOnload: []
			}
		},
		onLoad(options) {
			if (options && options.paramsCurrent) {
				this.params = JSON.parse(options.paramsCurrent)
				this.$refs.refListFilters.initShareData(this.params)
				this.fetchData(true)
			}
		},
		onShareAppMessage() {
			let url = '/commonViews/EmergencyList?paramsCurrent=' + JSON.stringify(this.params)
			return {
				path: url,
				title: '【急聘专区】最新急聘专区企业列表 - ' + this.$store.state.config.sitename,
				desc: ''
			}
		},
		onShareTimeline() {
			return {
				path: '/commonViews/EmergencyList?paramsCurrent=' + JSON.stringify(this.params),
				title: '【急聘专区】最新急聘专区企业列表 - ' + this.$store.state.config.sitename,
			}
		},
		methods: {
			toDetail(id) {
				let selectArr = uni.getStorageSync('selectArr')
				selectArr = selectArr == 'null' || selectArr == null || selectArr == '' ? [] : JSON.parse(selectArr)
				if (selectArr.indexOf(id) == -1 || selectArr.length == 0) {
					selectArr.push(id)
				}
				this.selectArrOnload = selectArr
				uni.setStorageSync('selectArr', JSON.stringify(selectArr))
				for (let i in this.dataset) {
					if (this.dataset[i].id == id) {
						this.dataset[i].clicked = true
					}
				}
				uni.navigateTo({
					url: '/commonViews/JobShow?id=' + id
				})
			},
			// 请求列表数据，init为true时直接更改dataset值，false时代表上拉加载回的数据追加进dataset
			fetchData(init) {
				this.show_empty = false
				let conditions = {
					...this.params
				}
				if (init === true) {
					this.page = 1
					this.finished_status = 'loading'
				}
				conditions.page = this.page
				conditions.pagesize = this.pagesize
				http
					.get(api.joblist, conditions)
					.then(res => {
						if (init === true) {
							this.dataset = [...res.data.data.items]
						} else {
							this.dataset = this.dataset.concat(res.data.data.items)
						}
						// 判断用户是否点击查看过某些数据
						if (this.selectArrOnload.length > 0) {
							for (let j in this.selectArrOnload) {
								for (let i in this.dataset) {
									if (this.dataset[i].id == this.selectArrOnload[j]) {
										this.dataset[i].clicked = true
									} else {
										this.dataset[i].clicked = false
									}
								}
							}
						} else {
							for (let i in this.dataset) {
								this.dataset[i].clicked = false
							}
						}
						this.skeletonLoading = false
						this.finished_status = 'loadmore';
						// 数据全部加载完成
						if (res.data.data.items.length < this.pagesize) {
							this.finished_status = 'nomore'
							if (init === false) {
								this.finished_status = 'nomore'
							} else if (res.data.data.items.length === 0) {
								this.show_empty = true
								this.finished_status = 'nomore'
							}
						}
					})
					.catch(() => {})
			},
			// 地区
			doSearchByDistrict(data) {
				this.params.districtName = data.districtName
				this.doSearch({
					district1: data.district1,
					district2: data.district2,
					district3: data.district3
				})
			},
			// 职位
			doSearchByCategory(data) {
				this.params.categoryName = data.categoryName
				this.doSearch({
					category1: data.category1,
					category2: data.category2,
					category3: data.category3
				})
			},
			// 搜索通用函数
			doSearch(data) {
				for (const key in data) {
					if (this.params.hasOwnProperty(key)) {
						this.params[key] = data[key]
					}
				}
				this.params.otherNum = data.otherNum
				if (this.params.otherNum == 0) {
					this.params.education = ''
					this.params.wage = ''
					this.params.experience = ''
					this.params.tag = ''
					this.params.settr = ''
				}
				this.page = 1
				this.fetchData(true)
			},
			// 其他搜索
			doSearchByOther(data) {
				this.doSearch(data)
			}
		},
	}
</script>

<style scoped lang="scss">
	.jobList {
		padding: 0 30rpx 1rpx;
	}
</style>